<template>
  <Card style="height:800px">
    <p slot="title" style="color: red;font-size: large;">
      征信前置任务
    </p>
    <marvels-task-count :taskNodes="taskNodes"></marvels-task-count>
    <br>
    <Tabs type="card" v-model="card" @on-click="tabChange" style="width:97%;">
      <!-- <TabPane :label="waitCountNum" disabled name="wait">
        待处理
      </TabPane> -->
      <TabPane label="处理中" name="process">
        <!--处理中-->
        <!--序号、客户姓名、身份证号码、贷款名称、所属渠道、客户经理、取件时效、处理人、挂起时间、挂起原因；-->
        <Card>
          <div style="min-height: 400px;">
            <div class="page-box">
              <Table stripe border :columns="columns1" :data="data1"></Table>
              <Page :total="totalNumber" size="small" :current="currentPage" :page-size="pageSize" show-total @on-change="pageIndexChange"></Page>
            </div>
          </div>
        </Card>
      </TabPane>
      <TabPane label="已处理" name="deal">
        <Card>
          <div style="min-height: 400px;">
            <DatePicker type="date" v-model="startCreatedDate" placeholder="查询日期(起)" style="width: 200px"></DatePicker>
            <DatePicker type="date" v-model="endCreatedDate" placeholder="查询日期(止)" style="width: 200px"></DatePicker>
            <Input style="width: 200px;" v-model="assignee" placeholder="操作人员"></Input>
            <Button type="primary" @click="queryPage2">筛选</Button>
            <div class="page-box">
              <Table stripe border :columns="columns2" :data="data2" style="margin-top: 10px;"></Table>
              <Page :total="totalNumber2" size="small" :current="currentPage2" :page-size="pageSize2" show-total @on-change="pageIndexChange2"></Page>
            </div>
          </div>
        </Card>
      </TabPane>
      <Button type="error" @click="abtainTask" slot="extra" style="float: right; ">取件</Button>
    </Tabs>
  </Card>
</template>

<script>
import marvelsTaskCount from '../../components/marvels-task-count.vue'
import expandRow from './table-expand.vue'
export default {
  components: {
    expandRow,
    marvelsTaskCount
  },
  data () {
    return {
      $ajax: null,
      taskNodes: ['woCheckingBefore'],
      path: this.$route.path,

      card: 'process',

      totalNumber: 10, // 总记录数

      currentPage: 1, // 当前页码

      pageSize: 20, // 页大小

      totalNumber2: 10,

      currentPage2: 1,

      pageSize2: 20,

      waitCount: 0, // 待处理单子数

      startCreatedDate: null,
      endCreatedDate: null,

      assignee: '',
      // 序号、客户姓名、身份证号码、贷款名称、所属渠道、客户经理、取件时效、处理人、挂起时间、挂起原因；
      // 待处理列
      columns1: [
        {
          type: 'expand',
          width: 30,
          render: (h, params) => {
            var vm = this
            return h(expandRow, {
              props: {
                row: params.row
              },
              on: {
                jumpEvent () {
                  vm.queryPage()
                }
              }
            })
          }
        },
        {
          align: 'center',
          type: 'index',
          width: 60,
          title: '序号'
        },
        {
          align: 'center',
          title: '客户姓名',
          key: 'custName',
          render: (h, param) => {
            var vm = this
            return h('div', [
              h('a', {
                style: {
                  textDecoration: 'underline'
                },
                on: {
                  'click' () {
                    vm.$router.push({
                      name: 'creditApproveFront',
                      query: {
                        loanId: param.row.loanId,
                        custCardNo: param.row.custCardNo,
                        type: 1
                      }
                    })
                    // vm.$router.push({ path: 'approval-management/credit-report-check/creditApproveFront', name: 'creditApproveFront', query: { loanId: param.row.loanId, custCardNo: param.row.custCardNo, type: 3 } })
                    // alert(param.row.loanId + "进入个人信用报告页");
                  }
                }
              }, param.row.custName)
            ])
          }
        },
        {
          align: 'center',
          title: '进件号',
          key: 'loanId'
        },
        {
          align: 'center',
          title: '身份证号码',
          key: 'custCardNo'
        },
        {
          align: 'center',
          title: '贷款名称',
          key: 'productName'
        },
        {
          align: 'center',
          title: '所属渠道',
          key: 'channelName'
        },
        {
          align: 'center',
          title: '客户经理',
          key: 'employeeName'
        },
        {
          align: 'center',
          title: '取件时效',
          render: (h, params) => {
            // 取件时间
          }
        },
        {
          align: 'center',
          title: '处理人',
          key: 'assignee'
        },
        {
          align: 'center',
          title: '挂起时间',
          key: 'hangTime',
          render: (h, params) => {
            var vm = this
            return h('div', [
              h('span', vm.$util.formatTime(params.row.hangTime))
            ])
          }
        },
        {
          align: 'center',
          title: '挂起原因',
          key: 'hangReason'
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          width: 200,
          render: function (h, param) {
            var vm = this
            return h('div', {}, [
              h('Button', {
                props: {
                  type: 'info',
                  size: 'small'
                },
                style: {
                  marginLeft: '10px'
                },
                on: {
                  'click' () {
                    vm.$router.push({
                      path: 'credit-report-check/creditApproveFront',
                      name: 'creditApproveFront',
                      query: {
                        loanId: param.row.loanId,
                        custCardNo: param.row.custCardNo,
                        type: 1
                      }
                    })
                  }
                }

              }, '征信审批前置')

            ])
          }.bind(this)

        }
      ],

      // 待处理数据
      data1: [],

      // 已处理列
      columns2: [{
        type: 'index',
        width: 60,
        title: '序号'
      },
      {
        title: '客户姓名',
        key: 'custName'
      },
      {
        title: '身份证号码',
        key: 'custCardNo'
      },
      {
        title: '贷款名称',
        key: 'productName'
      },
      {
        title: '所属渠道',
        key: 'channelName'
      },
      {
        title: '客户经理',
        key: 'employeeName'
      },
      {
        title: '取件时效',
        key: 'wasteTime',
        render: (h, params) => {
          if (params.row.wasteTime) {
            return h('div', [
              h('span', params.row.wasteTime + '分钟')
            ])
          }
        }
      },
      {
        title: '处理人',
        key: 'assignee'
      },
      {
        title: '挂起时间',
        key: 'hangTime',
        render: (h, params) => {
          var vm = this
          return h('div', [
            h('span', vm.$util.formatTime(params.row.hangTime))
          ])
        }
      },
      {
        title: '挂起原因',
        key: 'hangReason'
      }
      ],

      // 已处理数据
      data2: [

      ]

    }
  },

  methods: {

    // 待处理列表
    pageIndexChange (pageIndex) {
      this.currentPage = pageIndex
      this.queryPage()
    },

    // 已处理列表
    pageIndexChange2 (pageIndex) {
      this.currentPage2 = pageIndex
      // 查询已完成审核接口
      this.queryPage2()
    },

    initPage () {
      this.queryPage()
    },

    queryPage () {
      const vm = this
      var params = {
        pageNum: vm.currentPage,
        pageSize: vm.pageSize,
        curNodeCodes: ['woCheckingBefore'],
        curNodeCode: 'woCheckingBefore'
      }
      vm.$ajax.post(vm.$appContext.marvels_core_approve + '/approve/credit/report/service/creReportBeforeList', params).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code !== 'success') {
          vm.$Message.warning(message)
          return
        }
        vm.data1 = data.data.pageInfo.list
        for (let i = 0; i < vm.data1.length; i++) {
          if (vm.data1[i].productType !== '1' && vm.data1[i].productType !== '17') {
            vm.data1[i]._disableExpand = true
          }
        }
        vm.totalNumber = data.data.pageInfo.total
        vm.waitCount = data.data.waitCount
      }).catch(er => {

      })
    },

    queryPage2 () {
      var vm = this
      var params = {
        pageNum: vm.currentPage2,
        pageSize: vm.pageSize2,
        startCreatedDate: vm.startCreatedDate,
        endCreatedDate: vm.endCreatedDate,
        assignee: vm.assignee
      }
      // 查询
      vm.$ajax.post(vm.$appContext.marvels_core_approve + '/approve/credit/report/service/finishCreReportBeforeList', params).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code === 'success') {
          vm.data2 = re.data.data.list
          vm.totalNumber2 = re.data.data.total
          // vm.$Message.success(message)
        } else {
          vm.$Message.warning(message)
        }
      }).catch(er => {

      })
    },

    // 取件
    abtainTask () {
      var vm = this
      var params = {
        nodeCode: sessionStorage.nodeCode,
        groupCode: sessionStorage.groupCode,
        curNodeCode: 'woCheckingBefore'
      }
      vm.$ajax.post(vm.$appContext.marvels_core_approve + '/approve/credit/report/service/getTask', params).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code === 'success') {
          vm.$Message.success(message)
          vm.queryPage()
        } else {
          vm.$Message.warning(message)
        }
      }).catch(er => {

      })
    },

    // 面板切换
    tabChange (tabName) {
      var vm = this
      if (tabName === 'deal') {
        // 查询已经处理完成的列表
        if (vm.data2.length === 0) {
          vm.queryPage2()
        }
      }
    }

  },

  created () {
    // 初始化当前页面请求对象实例
    this.$ajax = this.$util.ajax()
    this.initPage()
  },

  computed: {
    // 待处理的数量
    waitCountNum: function () {
      var vm = this
      return '待处理 ' + vm.waitCount + ' 份'
    }
  }

}
</script>

<style lang="less">
@import '../../../styles/common.less';
@import '../../../styles/table.less';
</style>
